<template>
  <div class='' style='height: 260px;width:560px' @mouseout='mouseout' @mouseover='mouseover'>
	  <el-table
	      :data="tableData"
	      height="250"
	      border
	      style="width: 100%">
	      <el-table-column
	        prop="date"
	        label="日期"
	        width="180">
	      </el-table-column>
	      <el-table-column
	        prop="name"
	        label="姓名"
	        width="180">
	      </el-table-column>
	      <el-table-column
	        prop="address"
	        label="地址">
	      </el-table-column>
	    </el-table>
                
  </div>
  
</template>
import vueSeamlessScroll from 'vue-seamless-scroll' // 循环滚动
Vue.use(vueSeamlessScroll);
<script>
import {
		getCurrentInstance
	}
	from "vue";
export default {
   components: {
     // "iview-circle": IviewCircle
   },
   data() {
     return {
		 tableData: [{
		           date: '2016-05-03',
		           name: '王小虎',
		           address: '上海市普陀区金沙江路 1518 弄'
		         }, {
		           date: '2016-05-02',
		           name: '王小虎',
		           address: '上海市普陀区金沙江路 1518 弄'
		         }, {
		           date: '2016-05-04',
		           name: '王小虎',
		           address: '上海市普陀区金沙江路 1518 弄'
		         }, {
		           date: '2016-05-01',
		           name: '王小虎',
		           address: '上海市普陀区金沙江路 1518 弄'
		         }, {
		           date: '2016-05-08',
		           name: '王小虎',
		           address: '上海市普陀区金沙江路 1518 弄'
		         }, {
		           date: '2016-05-06',
		           name: '王小虎',
		           address: '上海市普陀区金沙江路 1518 弄'
		         }, {
		           date: '2016-05-07',
		           name: '王小虎',
		           address: '上海市普陀区金沙江路 1518 弄'
		         }],
				 timers: null,

	 };
   },
   created() {
     console.log("chart");
   },
   methods:{

	        
	       
   },
   mounted() {
	 // 拿到表格挂载后的真实DOM
	 const instance = getCurrentInstance();
	 	    const table = instance.refs.table;
	 	    // 拿到表格中承载数据的div元素
	 	    const divData = table.$refs.bodyWrapper;
	  clearInterval(this.timers);
	  // 拿到元素后，对元素进行定时增加距离顶部距离，实现滚动效果(此配置为每100毫秒移动1像素)
	  this.timers = setInterval(() => {
	    // 元素自增距离顶部1像素
	    divData.scrollTop += 1;
	    // 判断元素是否滚动到底部(可视高度+距离顶部=整个高度)
	    if (divData.clientHeight + divData.scrollTop >= divData.scrollHeight) {
	      // 重置table距离顶部距离
	      divData.scrollTop = 0;
	    }
	  }, 60);  // 滚动速度
	
   },
   destroyed() {
   },
   
   beforeDestroy() {
     clearInterval(this.timers); // 销毁定时器
   },
 };
</script>

<style>

</style>